.hubzy_right
    flex: 1
    order: 5
    display: inline-block
    position: sticky
    top: 0
    height: 100vh

    #menu
        width: 100%
        height: 100vh
        margin: 0
        display: flow-root
        padding: 0 20px
        box-sizing: border-box
        a
            background: none
            color: inherit
            text-decoration: none

        .icon
            background: none

            &:hover
                color: var(--color-link);

        ol
            list-style-type: none

        ul
            display: inline-block
            margin: 0
            padding: 0
            list-style-type: none

            li
                display: inline-block
                margin-right: 15px
                vertical-align: middle

            li:last-child
                margin-right: 0

        #menu-icon
            float: right
            margin-right: 2rem
            margin-left: 15px

            &:hover
                color: var(--color-accent-1)

        #menu-icon-tablet
            float: right
            margin-right: 2rem
            margin-left: 15px

            &:hover
                color: var(--color-accent-1)

        #top-icon-tablet
            position: fixed
            right: 2rem
            bottom: 2rem
            margin-right: 2rem
            margin-left: 15px

            &:hover
                color: var(--color-accent-1)

        .active
            color: var(--color-accent-1)


        #nav
            letter-spacing: .01em
            font-style: normal
            width 100%
            height:80px
            display: flex
            align-items: center
            ul
                display: flex
                justify-content: space-between

                li
                    border-right: 1px solid var(--color-scrollbar)
                    padding-right: 16px
                    a
                        font-size: 14px
            a:hover
                underline(5px, $color-accent-1)
                color: var(--color-link)
                // background-image:linear-gradient(transparent, transparent 5px, $color-link 5px, $color-link)

            li:last-child
                margin-right: 0
                border-right: 0

                a
                    margin-right: 0

        #actions
            float: right
            margin-top: 1rem
            margin-right: 2rem
            width: 100%
            text-align: right

            ul
                display: block

            .info
                display: block
                font-style: italic

        #share
            clear: both
            padding-top: 1rem
            padding-right: 2rem
            text-align: right

            li
                display: block
                margin: 0

    #toc
        float: right
        clear: both
        overflow: auto
        margin-top: 1rem
        padding-right: 2rem
        max-width: 20em
        max-height: calc(95vh - 7rem)
        text-align: right
        a
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            /* width: inherit; */
            display: flow-root;
        a
            &:hover
                color: var(--color-link);

        .toc-level-1 > .toc-link
            display: none

        .toc-level-2
            color: var(--color-text);
            font-size: .8rem

            // &:before
            // 	color: var(--color-accent-1)
            // 	content: "#"

        .toc-level-3
            color: var(--color-meta);
            font-size: .7rem

        .toc-level-4
            color: darken($color-meta, 20%)
            font-size: .4rem

        .toc-level-5
            display: none

        .toc-level-6
            display: none

        .toc-number
            display: none

        .read
            color: var(--color-link);
            border-bottom: 0;
            -webkit-transition: 0.5s;
            -moz-transition: 0.5s;
            -ms-transition: 0.5s;
            -o-transition: 0.5s;
